import Vue from 'vue';
import App from './App.vue';
import router from './router/routerGuard.js';
import store from './store';
import settingis from './setting.js';
import { deepCopy, typeOf, dateFormat, moneyFormat } from './utils/common.js'; // 绑定原型方法
import directives from './directives'; // 安装全局指令
import components from './components'; // 全局注册组件
import 'normalize.css'; // css 样式重置
import './styles/index.scss'; // css 样式
import '@a/iconfont/iconfont.css'; // 使用 iconfont
import './plugins'; // 使用第三方插件

import ScrollContainer from '@c/ScrollContainer.vue'; // 全局注册 ScrollContainer 组件
import PageTitle from '@c/PageTitle.vue'; // 全局注册 PageTitle 组件

Vue.config.productionTip = false;

Vue.prototype.$deepCopy = deepCopy;
Vue.prototype.$typeOf = typeOf;
Vue.prototype.$dateFormat = dateFormat;
Vue.prototype.$moneyFormat = moneyFormat;

Vue.use(directives); // 全局指令
Vue.use(components); // 全局组件

Vue.component('ScrollContainer', ScrollContainer);
Vue.component('PageTitle', PageTitle);

Vue.mixin({ // 全局混入
  computed: {
    modulesPermission() {
      return this.$store.getters.modulesPermission;
    },
    menusPermission() {
      return this.$store.getters.menusPermission;
    },
    functionsPermission() {
      return this.$store.getters.functionsPermission;
    },
    buttonsPermission() {
      return this.$store.getters.buttonsPermission;
    },
  },
  methods: {
    isMdlPermission(name) {
      if (!settingis.isProduction || !settingis.isDynamicPermission) {
        return true;
      }
      return !!this.modulesPermission.includes(name);
    },
    isMenuPermission(name) {
      if (!settingis.isProduction || !settingis.isDynamicPermission) {
        return true;
      }
      return !!this.menusPermission.includes(name);
    },
    isFuncPermission(name) {
      if (!settingis.isProduction || !settingis.isDynamicPermission) {
        return true;
      }
      return !!this.functionsPermission.includes(name);
    },
    isBtnPermission(name) {
      if (!settingis.isProduction || !settingis.isDynamicPermission) {
        return true;
      }
      return !!this.buttonsPermission[name];
    },
    tableActionWidth(arr = [], { width = 60, space = 10, padding = 10, exclusionBtns = [] } = {}) {
      const btnWidthArr = [];
      let count = 0, allWidth = 0, commonWidth = 0;
      function getCommonWidth(btnName, btnWidth) {
        let isCount = true;
        exclusionBtns.map((exclBtn, i) => {
          btnWidthArr[i] = btnWidthArr[i] || 0;
          if (typeof exclBtn == 'string') {
            if (btnName == exclBtn) {
              btnWidthArr[i] += btnWidth;
              isCount = false;
              return;
            } else {
              isCount = true;
            }
          } else {
            if (exclBtn.includes(btnName)) {
              btnWidthArr[i] += btnWidth;
              isCount = false;
              return;
            } else {
              isCount = true;
            }
          }
        });
        return isCount;
      }
      arr.map(item => {
        if (typeof item == 'string') {
          if (this.isMdlPermission([item]) || this.isMenuPermission([item]) || this.isFuncPermission([item]) || this.isBtnPermission([item])) {
            if (getCommonWidth(item, width)) {
              count++;
              allWidth += width;
            }
          }
        } else {
          if (this.isMdlPermission([item[0]]) || this.isMenuPermission([item[0]]) || this.isFuncPermission([item[0]]) || this.isBtnPermission([item[0]])) {
            if (getCommonWidth(item[0], item[1])) {
              count++;
              allWidth += item[1];
            }
          }
        }
      });
      if (count) {
        allWidth += space * (commonWidth ? count : count - 1) + padding * 2 + 1;
      } else {
        if (commonWidth) {
          commonWidth += padding * 2 + 1;
        }
      }
      return allWidth + commonWidth;
    },
    navigateBack({ to, from, params, query } = {}) {
      const route = from ? from : to;
      route.params = {
        ...route.params,
        ...params,
      };
      route.query = {
        ...route.query,
        ...query,
      };
      this.$router.push(route);
    },
  }
});

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app');
